import React, { useState } from "react";
import styles from "./index.module.less";
import getCalendar from "@utils/getCalendar";
import { useNavigate } from "react-router-dom";
import Tab from "./Tab";
import Main from "./Main";
import Bear from "./Bear";

const Calendar = () => {
    const navigate = useNavigate();

    const [ym, setYm] = useState({});

    const getTabProp = (ym) => {
        // console.log('ym: ', ym);
        setYm(ym);
    };

    return (
        <div className={styles.calendar}>
            <ul className={styles.dots}>
                <li className={styles.dot1}></li>
                <li className={styles.dot2}></li>
                <li
                    className={styles.dot3}
                    title="返回首页"
                    onClick={() => {
                        navigate("/");
                    }}
                ></li>
            </ul>
            <div className={styles.wrap}>
                <Tab getTabProp={getTabProp} />
                <Main getCalendar={getCalendar} ym={ym} />
            </div>
            <Bear />
        </div>
    );
};

export default Calendar;
